<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" >
        <title>报名表</title>
        <script src="js/flexible.debug.js"></script>
        <link href="css/signup.css" rel="stylesheet">
        <link rel="stylesheet" href="css/swiper-3.4.2.min.css" />
        <link rel="stylesheet" type="text/css" href="./css/bg.css">
    </head>
    <body>
        <form id="signupForm">
            <div id="header">
                <img class="LOGO" src="img/LOGO.png" alt="vtmer">
                <a href="index.html" class="BTN-HOME"><img src="img/BTN-HOME.png" alt="hmoe"/></a>
            </div>
            <div id="bgContent">
                <div id="haxagons"></div>
            </div>
            <div id="mainbody">
                <div class="mainTop">
                    <div action=""class="signupUser" >
                        <div>
                            <label for="Username" >姓名 :</label>
                            <input type="text" id="Username" placeholder="请输入姓名"/>
                        </div>
                        <div>
                            <label for="Usercollege">学院 :</label>
                            <input type="text" id="Usercollege" placeholder="请输入学院"/>
                        </div>
                        <div>
                            <label for="Usernumber">手机 :</label>
                            <input type="text" id="Usernumber" placeholder="请输入手机号码"/>
                        </div>
                    </div>
                    <div class="signupImg">
                        <img src="img/edit/图片位置.png" alt="signupImg" id="signupImg"/>
                        <input type="file" name="pic" id='upImg' accept="image/*" >
                        <p>注：图片大小不超过10m</p>
                    </div>
                </div>
                <div class="mainChoice">
                    <div id="signupIntroduceUSDiv">
                        <span>组别：</span>
                        <span id="introduceWrap"><a href="#" id="introduceUs">不了解设计组？</a></span>
                    </div>
                    <div id="signupBtn">
                        <input type="button" value="设计组" class="active" />
                        <input type="button" value="前端组"class="inactive"  />
                        <input type="button" value="后台组"class="inactive" />
                        <input type="button" value="运营组" class="inactive" />
                    </div>
                </div>
                <div class="mainEdit">
                    <p>个人简介：</p>
                    <textarea name="" id="signupBrief" placeholder="在此输入简介"></textarea>
                    <p>个人经历：</p>
                    <textarea name="" id="signupExpreriment" cols="30" rows="10"placeholder="在此输入经历"></textarea>
                </div>
                <div class="mainFoot">
                    <input type="button" value="完成"class="completed"/>
                    <input type="button" value="取消"class="cancle"/>
                </div>
            </div>
        </form>
        <!-- <div id="mask"></div> -->
        <!-- 判断弹窗 -->
       <!--  <div id="judgeAlert">
                       <img src="img/关闭.png" alt="关闭按钮" id="close3"/>
                       <div class="judgeAlertContent">
                               <p>请填写完整基本信息</p>
                               <p id="judgeMsg">"你叫啥名字呀?"</p>
               <input type="button" class="judgeBtn" value="好的，我知道了" />
                               
           </div>
       </div> -->
        <div class="BgContain">
            <ul class="scene" id="S1" data-scalar-x="38" data-scalar-y="38">
                <li class="layer" data-depth="0.60" id='bg1'><img src="img/bg1.png"></li>
            </ul>
            <ul class="scene" id="S2" data-scalar-x="38" data-scalar-y="38">
                <li class="layer" data-depth="0.60" id='bg2'><img src="img/bg7.png"></li>
            </ul>
            <ul class="scene" id="S3" data-scalar-x="38" data-scalar-y="38">
                <li class="layer" data-depth="0.40" id='bg3'><img src="img/bg3.png"></li>
            </ul>
            <ul class="scene" id="S4" data-scalar-x="38" data-scalar-y="38">
                <li class="layer" data-depth="0.60" id='bg4'><img src="img/bg6.png"></li>
            </ul>
            <ul class="scene" id="S5" data-scalar-x="38" data-scalar-y="38">
                <li class="layer" data-depth="0.80" id='bg5'><img src="img/bg4.png"></li>
            </ul>
            <ul class="scene" id="S6" data-scalar-x="38" data-scalar-y="38">
                <li class="layer" data-depth="1.00" id='bg6'><img src="img/bg9.png"></li>
            </ul>
            <ul class="scene" id="S7" data-scalar-x="28" data-scalar-y="28">
                <li class="layer" data-depth="1.00" id='bg7'><img src="img/bg11.png"></li>
            </ul>
            <ul class="scene" id="S8" data-scalar-x="28" data-scalar-y="28">
                <li class="layer" data-depth="0.60" id='bg4'><img src="img/bg10.png"></li>
            </ul>
            <ul class="scene" id="S9" data-scalar-x="28" data-scalar-y="28">
                <li class="layer" data-depth="0.80" id='bg5'><img src="img/bg8.png"></li>
            </ul>
            <ul class="scene" id="S10" data-scalar-x="28" data-scalar-y="28">
                <li class="layer" data-depth="1.00" id='bg6'><img src="img/bg2.png"></li>
            </ul>
            <ul class="scene" id="S11" data-scalar-x="28" data-scalar-y="28">
                <li class="layer" data-depth="1.00" id='bg6'><img src="img/bg12.png"></li>
            </ul>
            <ul class="scene" id="S12" data-scalar-x="28" data-scalar-y="28">
                <li class="layer" data-depth="1.00" id='bg6'><img src="img/bg5.png"></li>
            </ul>
        </div>
        <!-- Loading提交 -->
        <div class="LoadingWrap">
            <div class="loading">
                <span></span>
                <span></span>
                <span></span>
                <span></span>
                <span></span>
            </div>
        </div>
        <script src="./js/jq.min.js">
        </script>
        <script src="js/signup/swiper-3.4.2.min.js"></script>
        <script src="js/signup/signup.js"></script>
        <script src="js/signup/upimg.js"></script>
        <script src='./js/jquery.parallax.min.js'></script>
        <script>
                    $('.scene').parallax();
        </script>
    </body>
</html>